////////////////////////////////////////////////////////////////////////////
/**
      = Hello Vocabulary @2010 =
	version 0.2.10
http://code.google.com/p/hello-vocabulary/
******************************************************

Copyright (c) 2010 Mead, laiqinyi@gmail.com


@ MIT License:Licensing
http://www.opensource.org/licenses/mit-license.php
@ Creative Commons License
http://creativecommons.org/licenses/by/2.5/legalcode
**/

// Class describes context button that can be dynamically shown on the page
var ITEM_ADD ="add it";
var ITEM_DEL ="delete me";
var ContextButton = function()
{
    this._button;
    this._isAppended = false;
    this._init = function()
    {
        this._button = document.createElement('button');
        with (this._button.style)
        {
            margin = '0px';
            padding = '0px';
            width = '14px';
            height = '14px';
            position = 'absolute';
            cursor = 'pointer';
            border = 'none';
            display = 'none';
            background = 'url(http://www.gstatic.com/codesite/ph/images/dropdown_sprite.gif) no-repeat';
            zIndex = 4294967296;
            opacity = 1;
        }
        //ban them
        this._button.addEventListener('mouseup', function(e) {         
        	e.stopPropagation(); }, false);
        this._button.addEventListener('mousedown', function(e) {         	
        	 e.stopPropagation(); }, false);
        this._button.addEventListener('dblclick', function(e) {        	
        	 e.stopPropagation(); }, false);
        //add event
        this._button.addEventListener('click',
            function(e)
            {                
                e.stopPropagation();
                if (menu.isActive)
                {
                	//console.log('button.click#isFrozen=F');
                    btn.isFrozen = false;
                    menu.close();
                }
                else
                {
                	//console.log('button.click#isFrozen=F');
                    btn.isFrozen = true;
                    menu.open({ x: btn.pos.x, y: btn.pos.y + 14 });
                }
            },
            false);
    }

//invoke the init() method. as ctor...
    this._init();
    this.isActive = false;
    this.isFrozen = false;
    this.pos = { x: NaN, y: NaN };
    this.updateButtonStyle = function(topPxs, leftPxs, displayStyle)
    {
    	//console.log('updateButtonStyle'+displayStyle);
        with (this._button.style)
        {
            if (topPxs != NaN) top = topPxs + 'px';
            if (leftPxs != NaN) left = leftPxs + 'px';
            display = displayStyle;
        }
    }

    this.setOpacity = function(opacity)
    {
        this._button.style.opacity = opacity;
    }

    this.open = function(pos)
    {
        //console.log('button.open');
        if (!this._isAppended)
        {
            document.body.appendChild(this._button);
            this._isAppended = true;
        }
        this.pos = pos;
        this.updateButtonStyle(this.pos.y, this.pos.x, 'block');
        this.isActive = true;
        this.isFrozen = false;
    }

    this.show = function()
    {
        //console.log('button.show');
        this.updateButtonStyle(this.pos.y, this.pos.x, 'block');
        this.isActive = true;
        this.isFrozen = false;
    }

    this.hide = function()
    {
        //console.log('button.hide');
        this.updateButtonStyle(NaN, NaN, 'none');
        this.isActive = true;
        this.isFrozen = false;
        menu.close();
    }

    this.close = function()
    {
        //console.log('button.close');
        this._button.style.opacity = 1;
        this.pos = { x: NaN, y: NaN };
        this.updateButtonStyle(NaN, NaN, 'none');
        this.isActive = false;
        this.isFrozen = false;
        menu.close();
    }
}

//
// Class describes context menu that can be dymanically shown on the page
var ContextMenu = function()
{
    this._menu = { };
    this._isAppended = false;

    this._addItem = function(name, urlFormat)
    {
        var item = document.createElement('div');
        with (item.style)
        {
            margin = '0px';
            padding = '0px';
            paddingLeft = '4px';
            paddingRight = '6px';
            background = '#FFFFFF';
            color = '#000000';
            font = 'normal 12px verdana,sans-serif';
            textAlign = 'left';
            height = '24px';
            lineHeight = '24px';
            width = 'auto';
            overflow = 'visible';
        }
        var icon
        var iconSrc = urlFormat;
        if (iconSrc)
        {
            icon = document.createElement('img');
            //insert picture...be care of secure API
            icon.src = chrome.extension.getURL(urlFormat);
            icon.addEventListener('mousedown', function(e) { e.preventDefault(); }, false);
        }
        else
        {
        	//
            icon = document.createElement('span');
            icon.appendChild(document.createTextNode(urlFormat));
        }
        with (icon.style)
        {
            float = 'left';
            color = 'rgb(77,77,77)';
            margin = '0px';
            marginTop = '4px';
            marginRight = '6px';
            width = '16px';
            height = '16px';
            lineHeight = '16px';
            textAlign = 'center';
        }
        item.appendChild(icon);
        item.appendChild(document.createTextNode('' + name));
        item.addEventListener('mouseover', function() { 
        	//console.log('mouseover==item.');
        	item.style.background = '#B6BDD2'; 
        	}, false);
        item.addEventListener('mouseout', function() { 
        	 //console.log('mouseout==item.');
        	item.style.background = '#FFFFFF'; 
        	}, false);
        //Add Event Action.
        //Action: Add,Del=A,D
        item.addEventListener('mousedown',
            function(e)
            {
			                //console.log('mousedown==item.down');
			                e.stopPropagation();
			                selectedText = trim(selectedText);//trim it first
			                if (selectedText != '')
			                {
						                	//console.log('1selectedText = ' + selectedText);                	
						                	var turl = document.URL;
						                	if(name == ITEM_ADD){	                		
																	var surl ={};
																	surl.word = selectedText;
																	surl.title = document.title;
																	surl.action = "A";
																	var text = JSON.stringify(surl);
																	chrome.extension.sendRequest(
																			{word: text} 
																		//,function(response) {
																				//console.log("###Get rsp"+response.farewell);
																		//}
																	);
																	for(var i=0;i<500;i++){
																	}
																	makeColor();
						                	}else if(name == ITEM_DEL){
																	var surl ={};
																	surl.word = selectedText;
																	surl.title = document.title;
																	surl.action = "D";
																	var text = JSON.stringify(surl);
																	chrome.extension.sendRequest(
											                {word: text}
											                			//,function(response) {
											 											 		//console.log("###Get rsp"+response.farewell);
																						//}
																	);						
						                	}
						                	wasMenuClicked = true;
						                	//selection.collapseToEnd();
						                	btn.close();
			                }
            },
            false);
        //Add Items...
        this._menu.appendChild(item);
    }

    this._addItems = function()
    {
    	this._addItem(ITEM_ADD, "img/circle_green.png");    
    	this._addItem(ITEM_DEL, "img/circle_red.png");     
    }

    this._initMenu = function()
    {
        this._menu = document.createElement('div');
        //get the list for init Menu.
        //sendMessage({ name: 'getOptions' }, this._addItems);
        this._addItems();
        with (this._menu.style)
        {
            margin = '0px';
            padding = '2px';
            border = '1px solid gray';
            background = '#FFFFFF';
            position = 'absolute';
            display = 'none';
            cursor = 'default';
            width = 'auto';
            overflow = 'visible';
            zIndex = 4294967296;
        }
    }

    this._initMenu();
    this.isActive = false;
    
    this.open = function(point)
    {
        //console.log('menu.open');
        if (!this._isAppended)
        {
            document.body.appendChild(this._menu);
            this._isAppended = true;
        }
        this._menu.style.visibility = 'hidden';
        this._menu.style.display = 'block';

        if (point.x - window.pageXOffset + this._menu.offsetWidth > window.innerWidth - 20)
            point.x -= this._menu.offsetWidth - 14;
        if (point.y - window.pageYOffset + this._menu.offsetHeight > window.innerHeight - 20)
            point.y -= this._menu.offsetHeight + 14;

        this._menu.style.top = point.y + 'px';
        this._menu.style.left = point.x + 'px';
        this._menu.style.visibility = 'visible';
        this.isActive = true;
    }

    this.close = function()
    {
        //console.log('menu.close');
        this._menu.style.top = NaN;
        this._menu.style.left = NaN;
        this._menu.style.display = 'none';
        this.isActive = false;
    }
}


var menu = new ContextMenu();
var btn = new ContextButton();
var selectedText = '';
var wasMenuClicked = false;
var mouseStatus = { pressed: false, pressedEventArgs: {}, pressedAndMoved: false };

document.addEventListener('mouseup',
    function(e)
    {
        //console.log('document.up');
        if (e.button == 0)
        {
            updateContextButton(e, true);
        }
        mouseStatus.pressed = false;
        mouseStatus.pressedAndMoved = false;
    },
    false);

document.addEventListener('mousedown',
    function(e)
    {
        //console.log('document.down');
        if (btn.isActive)
        {
        	//console.log('btn.close()=365');
            btn.close();
        }
        mouseStatus.pressed = true;
        mouseStatus.pressedEventArgs = e;
        mouseStatus.pressedAndMoved = false;
    },
    false);

document.addEventListener('dblclick',
    function(e)
    {
        //console.log('document.dblclick');
        updateContextButton(e, false);
        mouseStatus.pressed = false;
        mouseStatus.pressedAndMoved = false;
    },
    false);

document.addEventListener('mousemove',
    function(e)
    {
        if (btn.isActive && !btn.isFrozen)
        {
            var distance = Math.sqrt(Math.pow(e.pageX - btn.pos.x, 2) + Math.pow(e.pageY - btn.pos.y, 2));
            if (distance < 30)
                btn.setOpacity(1);
            else if (30 < distance && distance < 530)
                btn.setOpacity(-7.0 * distance / 5000 + 1.042);
            else
                btn.setOpacity(0.3);
        }
        if (mouseStatus.pressed && !mouseStatus.pressedAndMoved)
        {
            mouseStatus.pressedAndMoved = true;
        }
    },
    false);

document.addEventListener('keydown',
    function(e)
    {
        //console.log('dicument.keyDown: code=' + e.keyCode);
        if ((e.keyCode == 27 && e.shiftKey == false && e.ctrlKey == false && e.altKey == false) ||
            (trim(window.getSelection().toString()) == ''))
        {
            if (btn.isActive) btn.close();
        }
    },
    false);


function updateContextButton(eventArgs, checkMouseStatus)
{
    var target = eventArgs.target;
    var pressedTarget = mouseStatus.pressedEventArgs.target;
    var selection = window.getSelection();
    selectedText = selection.toString();

    //console.log('selection: target = ' + target + ' (' + target.nodeName + ')');
    //console.log('selection: pressedTarget = ' + pressedTarget + ' (' + pressedTarget.nodeName + ')');
    //console.log('selection: text = "' + selectedText + '"');

    if (target.nodeName != 'TEXTAREA' && target.nodeName != 'INPUT' &&
        pressedTarget.nodeName != 'TEXTAREA' && pressedTarget.nodeName != 'INPUT')
    {
        if (!wasMenuClicked && trim(selectedText) != '' &&
            (!checkMouseStatus || mouseStatus.pressedAndMoved))
        {
            var buttonShift;
            if (checkMouseStatus)
            {
                var d = 20;
                var horShift = eventArgs.pageX - mouseStatus.pressedEventArgs.pageX;
                var verShift = eventArgs.pageY - mouseStatus.pressedEventArgs.pageY;
                buttonShift = (verShift > d) ? { x: 5, y: 5 } :
                    (verShift < -d || horShift < 0) ? { x: -15, y: -20 } : { x: 5, y: 5 };
            }
            else
            {
                buttonShift = { x: 5, y: 10 };
            }			
            btn.open({ x: eventArgs.pageX + buttonShift.x, y: eventArgs.pageY + buttonShift.y });
        }
        else
        {
            btn.close();
        }
    }
    if (wasMenuClicked)
    {
        selection.collapseToEnd();
        wasMenuClicked = false;
    }
}

function trim(string)
{
    return string.replace(/^\s+|\s+$/g, '');
}

//on=1,off=0
function is_on(){
	return true;
}

//get keywords and render it
function makeColor(){
	//TODO
	// here read the config, decide whether render the page...
	//TODO
	
	//get word == GW
 	chrome.extension.sendRequest(
             {word: "GW"}, 
                				function(response) {
	                					var backdata = response.farewell; 											 								
	                					if(backdata == null || backdata == ""){
															//console.log("Nothing to Hilighter ...");
	 														return;
 														} 		
														//console.log("Hilighter it..."); 									
														hl.highlight(document.body, backdata);  
												}
		);
}

//golble var
var hl = new Highlighter();  
//auto execute, when page load over.
makeColor();
											

